<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="ISO-8859-1">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <title>SpreadShout - Admin</title>

        <link rel="stylesheet" href="css/bootstrap.css">
        <link rel="stylesheet" href="css/back.css">
        <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
    </head>
    <body>

        <!-- NAVIGATION -->
        <aside>
            <nav class="wrapper">
                <a class="logo" href="#">
                    <img src="img/logo-txt-wh.png" alt="Spread Shout">
                </a>
                <div id="toggle-menu" class="open-sidebar right"><i class="fa fa-bars"></i></div>
                <div class="off-canvas">
                <div class="views">
                    <div class="entity dropdown left">
                        <a class="dLabel" role="button" data-toggle="dropdown" data-target="#" href="#">
                            <i class="fa fa-globe"></i><span>Entities</span><i class="fa fa-caret-down"></i>
                        </a>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                            <li><a href="" class="dd-new-entity">Set-up new entity</a></li>
                        </ul>
                    </div>

                    <!-- <a href="#"><i class="fa fa-users"></i>Entities</a> -->
                    <a href="#"><i class="fa fa-comment"></i>Supports</a>
                    <a href="#" class="visible-off-canvas"><i class="fa fa-user"></i>Edit Profile</a>
                    <a href="#" class="visible-off-canvas"><i class="fa fa-sign-out"></i>Sign Out</a>
                </div>
                <div class="settings dropdown right">
                    <span class="dLabel" role="button" data-toggle="dropdown" data-target="#">
                        <!-- <div class="current hidden-xs">
                            <i class="fa fa-user"></i><span>Juan Perez</span><i class="fa fa-caret-down"></i>
                        </div> -->
                         <div class="hidden-off-canvas">
                            <img src="img/user.jpg" alt="user-profile-pic"/></img><!--
                            --><!-- <i class="fa fa-caret-down"></i> -->
                        </div>
                    </span>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                        <li><a href="#">Edit profile</a></li>
                        <li><a href="#">Sign out</a></li>
                    </ul>
                </div>
                <div class="footer-links">
                    <ul>
                        <li><a  href="#">FAQ</a></li>
                        <li><a  href="#">Help</a></li>
                    </ul>
                    
                </div>
                </div>
            </nav>
        </aside>
        <!-- NAVIGATION -->

        <!-- WHITE BLOCK -->
        <div class="main-content">

            <!-- ENTITY -->
            <header>
                <div class="wrapper">
                <div class="user">
                        <div class="current">
                            <img src="img/face.png" alt=""/>
                            <div class="active-user">
                                <span class="nav-tag">Working as</span>
                                <span>Juan Perez</span>
                            </div>
                        </div>
                </div>
                
                
                <ul class="entity-nav">
                    <li><a href="#" class="red-bg red-button"><i class="fa fa-plus"></i><span>New Entity</span></a></li>
                    <li><a href="#"><i class="fa fa-globe"></i>My Entities</a></li>
                    <li><a href="#"><i class="fa fa-comment"></i>My Supports</a></li>
                    <li><a href="#"><i class="fa fa-bullhorn"></i>Shouts</a></li>
                </ul>
                
                <div class="mobile-entity-nav">
                
                <div class="settings right dropdown right">
                    <span class="dLabel" role="button" data-toggle="dropdown" data-target="#">
                        <!-- <div class="current hidden-xs">
                            <i class="fa fa-user"></i><span>Juan Perez</span><i class="fa fa-caret-down"></i>
                        </div> -->
                        <div class="current">
                            <i class="fa fa-caret-down"></i>
                            <span>More</span>
                        </div>
                    </span>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                        <li><a href="#"><i class="fa fa-users"></i>My Entities</a></li>
                    <li><a href="#"><i class="fa fa-comment"></i>My Supports</a></li>
                    <li><a href="#"><i class="fa fa-bullhorn"></i>Shouts</a></li>
                    </ul>
                </div>
                <a href="#" class="red-bg red-button "><i class="fa fa-users"></i><span> New Entity</span></a>
                </div>
              </div>  
            </header>
            <!-- END ENTITY -->


            <!-- MAIN SECTION -->
            <section class="wrapper">
                <div class="main-top">
                    <h2 class="left">Welcome! Let's get you started.</h2>
                </div>                    
               
               
                <article class="white-box call-to-action">
                    <div class="shout-head"><h3>Set-up your first entity</h3></div>
                    <p>Before you can start <strong>Spreading your message</strong>, you need to create your organization's profile and recruit page.</p>
                    
                    <a href="#" class="red-bg red-button"><i class="fa fa-users"></i><span>Set-up my entity</span></a>
                    
                </article>
                
                <!-- GENERAL SHOUT ANALYTICS -->
                
                <div class="clearfix"></div>

                <div class="main-top">
                    <h2 class="left">Organizations you could support</h2>
                </div>                    
                <div class="circle-content">
                <div class="row">
                            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3 space">
                                <div class="row">
                                    <div class="col-xs-4  col-md-12 col-lg-12">
                                        <div class="circle-brand"><img src="img/logos/pdlr.png" alt="" /></div>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <p class="brand-txt-align"><strong>Partido de la red</strong> <br /><span>Political Party</span></p>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <a href="#" class="support-button"><span>Support</span></a>                                    
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3 space">
                                <div class="row">
                                    <div class="col-xs-4  col-md-12 col-lg-12">
                                        <div class="circle-brand"><img src="img/logos/gp.png" alt="" /></div>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <p class="brand-txt-align"><strong>Green Peace</strong> <br /><span>NGO</span></p>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <a href="#" class="support-button"><span>Support</span></a>                                    
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3 space">
                                <div class="row">
                                    <div class="col-xs-4  col-md-12 col-lg-12">
                                        <div class="circle-brand"><img src="img/logos/tn.png" alt="" /></div>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <p class="brand-txt-align"><strong>Todo Noticias</strong> <br /><span>News</span></p>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <a href="#" class="support-button"><span>Support</span></a>                                    
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3 space">
                                <div class="row">
                                    <div class="col-xs-4  col-md-12 col-lg-12">
                                        <div class="circle-brand"><img src="img/logos/tn.png" alt="" /></div>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <p class="brand-txt-align"><strong>Todo Noticias</strong> <br /><span>News</span></p>
                                    </div>
                                    <div class="col-xs-8  col-md-12 col-lg-12">
                                        <a href="#" class="support-button"><span>Support</span></a>                                    
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                
                <!-- GENERAL SHOUT ANALYTICS -->
                
                <div class="clearfix"></div>
                
                
            </section>
            <!-- END MAIN SECTION -->
        <div class="wrapper">
            <footer>
            <div class="footer-links left">
                <ul>
                    <li><a  href="#">FAQ</a></li>
                    <li><a  href="#">About us</a></li>
                    <li><a  href="#">Pricing</a></li>
                    <li><a  href="#">Blog</a></li>
                </ul>
            </div>
            <p class="language left">Language <a class="red" href="#">en</a>|<a class="red" href="#">es</a></p>           

            <div class="contact">
                <p>Got any questions? Feel free to <a class="red" href="mailto:hi@spreadshout.com">Contact Us</a>. &reg; 2014 SpreadShout. All rights reserved</p>
                
            </div>
        </footer>
        </div>
        </div>
        <div class="clearfix"></div>
        <!-- END WHITE BLOCK -->
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script>
        <script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
        <script src="js/vendor/bootstrap.min.js"></script>
        <script src="js/jquery.nicescroll.js"></script>
        <script src="js/back.js"></script>
        <script type="text/javascript" src="js/jquery.tooltipster.min.js"></script>
        <script type="text/javascript">
            $('.dropdown-toggle').dropdown();

            $('.search input').focus(function() {
                $('.search .fa-search').hide();
                if ($(window).width() < 480) {
                    $('.search-overlay').show();
                    $('.search').css('position', 'static');
                    $('.close-for-small').fadeIn();
                }
            });
            $('.search input').focusout(function() {
                $('.search .fa-search').css('display', 'inline');
                $('.search-overlay').hide();
                $('.search').css('position', 'relative');
                $('.close-for-small').hide();
            });
            var sidebarState = 'closed';
            $('.open-sidebar').click(function() {
                if (sidebarState == 'closed') {
                    $('aside').addClass('open');
                    $('.main-content').addClass('push');
                    sidebarState = 'open';
                } else {
                    $('aside').removeClass('open');
                    $('.main-content').removeClass('push');
                    sidebarState = 'closed';
                }
            });

            $(".table-responsive").niceScroll({
                cursorcolor: '#E8E8E8',
                cursorborder: '#E8E8E8',
                topalign: 10,
            });
        </script>
        </script>
        <!-- //Tooltip -->
            <script>
        $(document).ready(function() {
            $('.has-tooltip').tooltipster();
        });
    </script>
    </body>
</html>